import React, {Component} from 'react';

import './index.less';

import {
    base
} from 'nc-lightapp-front';

import HRPagination from '../../../../../hrpub/common/components/Pagination';

import pageIns from '../../instant';

class MainTable extends Component {
    constructor(props) {
        super(props);

        this.changePage = this.changePage.bind(this);
        this.changePageSize = this.changePageSize.bind(this);
        this.clickHandle = this.clickHandle.bind(this);
        this.getRightHeight = this.getRightHeight.bind(this);
    }

    getRightHeight() {
        let rightContentHeight = 0;

        if (window.getComputedStyle && pageIns.rightRef) {
            rightContentHeight = window.getComputedStyle(pageIns.rightRef).height.replace('px', '');
        }

        return rightContentHeight
    }

    componentDidMount() {
        this.props.updateState({
            myTableStash: pageIns.ins.myTable['ncc60071025list']
        });
    }

    changePageSize(value) {
        this.changePagination({
            pageSize: value,
            pageIndex: 1
        });
    }

    changePagination(nPageInfo) {
        const {
            pageInfo,
            updateState,
            getMainTableData
        } = this.props;

        updateState({
            pageInfo: {
                ...pageInfo,
                ...nPageInfo
            },
            // 是否允许跨页面选择
            selectedRows: []
        }, () => {
            getMainTableData();
        });
    }

    changePage(value) {
        this.changePagination({
            pageIndex: value
        });
    }

    clickHandle(props, moduleId, record, index) {
        this.props.updateState({
            clickRow: {
                index: index,
                record: record
            }
        });
    }

    onSelected = (props, moduleId, record, index, isSelected) => {
        this.props.editTable.setClickRowIndex('ncc60071025list', {
            record: record,
            index: index
        });
        this.props.editTable.focusRowByIndex('ncc60071025list', index);
        this.props.updateState({
            clickRow: {
                index: index,
                record: record
            }
        });
        this.props.handleTableSelect(props, moduleId, record, index)
    };

    render() {
        const {
            editTable,
            pageInfo,
            showTableCheckbox,
            mainTableHeight,
            page,
            pageHeight
        } = this.props;

        let rightHeight = this.getRightHeight();

        return (
            <div>
                <div
                    id="keyPsnMainTable"
                    style={{
                        minHeight: `${rightHeight - 60}px`
                    }}
                >
                    {editTable.createEditTable('ncc60071025list', {
                        showCheck: showTableCheckbox,
                        onSelected: this.onSelected,
                        onSelectedAll: this.props.selectAll,
                        onRowDoubleClick: (record) => {
                            if (page !== 'adjust-sort') {
                                this.props.updateState({
                                    selectedRows: [{data: record}],
                                    pageFrom: 'dbClick'
                                }, () => {
                                    this.props.toEditPage('dbClick');
                                });
                            }
                        },
                        onRowClick: this.clickHandle,
                        height: pageHeight - 130,
                        adaptionHeight: true
                    })}
                </div>
                <div
                    style={{
                        padding: '12px 20px 12px 0'
                    }}
                >
                    {
                        pageInfo.total > 0 &&
                        <HRPagination
                            current={parseInt(pageInfo.pageIndex)}
                            pageSize={parseInt(pageInfo.pageSize)}
                            pageSizeOptions={[5, 10, 20, 50, 100]}
                            showSizeChanger={false}
                            total={pageInfo.total}
                            onShowSizeChange={this.changePageSize}
                            onChange={this.changePage}
                            showSizeInput={true}
                        />
                    }
                </div>
            </div>
        );
    }
}

export default MainTable;
